<template>
  <div class="container">
    <el-card>
      <el-form label-width="80px">
        <el-row>
          <el-col :span="6">
            <el-form-item label="关键字">
              <el-input style="200px"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="6" :offset="12">
            <el-form-item style="text-align:right">
              <el-button>清除</el-button>
              <el-button>搜索</el-button>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <el-alert :title="`数据一共 ${number} 条`" type="info" class="alert" show-icon :closable="false"></el-alert>
      <el-table :data="tableData" style="width: 100%">
        <el-table-column prop="id" label="编号" width="200"></el-table-column>
        <el-table-column label="题型" width="120"></el-table-column>
        <el-table-column label="题目编号" width="120"></el-table-column>
        <el-table-column prop="addTime" label="录入时间" width="120"></el-table-column>
        <el-table-column prop="totalSeconds" label="答题时间(s)" width="120"></el-table-column>
        <el-table-column prop="accuracyRate" label="正确率(%)" width="120"></el-table-column>
        <el-table-column prop="userName" label="录入人" width="120"></el-table-column>
        <el-table-column label="操作" width="120">
          <el-button plain type="danger" size="small" circle icon="el-icon-delete" title="删除"></el-button>
        </el-table-column>
      </el-table>
    </el-card>
    <!-- 预览效果 -->
    <questions-preview v-if="false" />
  </div>
</template>

<script>
import { randoms as questionList } from '@/api/hmmm/questions'
import QuestionsPreview from '../components/questions-preview'
export default {
  components: {
    QuestionsPreview
  },
  data () {
    return {
      input: '',
      number: 0,
      tableData: [],
      requestParams: {
        keyword: null,
        page: 1,
        pagesize: 20
      }
    }
  },
  async created () {
    this.getList()
  },
  methods: {
    async getList () {
      const { data: questionsData } = await questionList(this.requestParams)
      this.tableData = questionsData.items
      this.number = questionsData.counts
      console.log(questionsData)
    }
  }
}
</script>

<style scoped lang='less'>
.alert {
  margin-bottom: "15px";
}
.el-icon-delete {
  background-color: "red";
}
</style>
